<template>
	<section class="child_page">
		<head-top crossover="我的收藏"></head-top>
		<section class="collect">
			<section class="collectchild">
				<ul>
					<li v-for="item in collect">
						<div class="collect_top clear">
							<img :src="item.headurl" alt="">
							<span>{{item.remarks ? item.remarks : item.petname}}</span>
							<i>{{item.collectime}}</i>
						</div>
						<div class="collect_bottom">
							<div v-if="item.collectext" class="collectext">{{item.collectext}}</div>
							<div class="collectimg" v-if="item.collectimg"> 
								<img :src="item.collectimg" alt=""  />
							</div>
						</div>
					</li>
				</ul>
			</section>
		</section>
	</section>	
</template>

<script>
	import headTop from '@/components/header/head'
	import {collect} from '@/service/getData.js'
	export default{
		data(){
			return{
				collect:[],
			}
		},
		created(){
			collect().then( (res) => {
				this.collect=res
			})
		},
		mounted(){
			
		},
		components:{
			headTop,
		},
		computed:{
			
		},
		methods:{

		}
	}
</script>
// <style lang="less" scoped>
// 	//@/style/public.less
// 	.child_page{
// 		position: absolute;
// 		width:100%;
// 		height:100%;
// 		top: 0;
// 		left: 0;
// 		right: 0;
// 		bottom: 0;
// 		z-index: 203;
// 		background-color: #ebebeb;
// 	}
// 	.collect{
// 		background-color: #ebebeb;
// 		overflow-y:auto; 
// 		-webkit-overflow-scrolling:touch;
// 		.collectchild{
// 			padding-top: 2.06933rem;
// 			ul{
// 				li{
// 					margin-top:0.2133333333rem;
// 					padding:0.8533333333rem;
// 					background:#fff;
// 					.collect_top{
// 						img{
// 							float:left;
// 							@include widthHeight(1.0666666667rem,1.0666666667rem);
// 							border-radius:50%;
// 							margin-right:0.4266666667rem;
// 						}
// 						span{
// 							float:left;
// 							@include sizeColor(0.5973333333rem,#666);
// 							line-height:1.0666666667rem;
// 						}
// 						i{
// 							float:right;
// 							font-style:nomal;
// 							@include sizeColor(0.512rem,#999);
// 							line-height:1.0666666667rem;
// 						}
// 					}
// 					.collect_bottom{
// 						margin-top:0.6826666667rem;
// 						.collectext{
// 							line-height:0.8533333333rem;
// 							@include sizeColor(0.64rem,#000);
// 						}
// 						.collectimg{
// 							width:9.7706666667rem;
// 							height:5.888rem;
// 							overflow: hidden;
// 							img{
// 								display:block;
// 								width:9.7706666667rem;
// 								height:auto;
// 							}
// 						}
// 					}
// 				}
// 			}
// 		}		
// 	}	
// </style>